﻿@using OneOf
@namespace Masa.Blazor.Docs.Examples.components.data_iterators

<MDataIterator FooterProps="@(props => props.ItemsPerPageOptions = _itemsPerPageOptions)"
               Items="_items"
               ItemsPerPage="@_itemsPerPage"
               Page="_page"
               Search="@_search"
               SortBy="_sortBy"
               SortDesc="_sortDesc"
               ItemValues="_keys"
               DisableFiltering="DisableFiltering"
               DisablePagination="DisablePagination"
               DisableSort="DisableSort"
               HideDefaultFooter="HideDefaultFooter"
               Style="height: 288px; overflow-y: auto; overflow-x: hidden;">
    <HeaderContent>
        <MToolbar Dark Color="blue darken-3" Class="mb-1">
            <MTextField @bind-Value="_search"
                        Clearable
                        Flat
                        SoloInverted
                        HideDetails="true"
                        PrependInnerIcon="mdi-magnify"
                        Label="Search">
            </MTextField>
            <MSpacer class="hidden-sm-and-down" />
            <MSelect @bind-Value="_sortBy"
                     ItemValue="s => s.Name"
                     ItemText="s => s.Name"
                     Class="mx-2 hidden-sm-and-down"
                     Flat
                     SoloInverted
                     HideDetails="true"
                     Items="_keys"
                     PrependInnerIcon="mdi-magnify"
                     Label="Sort by">
            </MSelect>
            <MSpacer class="hidden-sm-and-down" />
            <MButtonGroup Value="_sortDesc.ToString()"
                          ValueChanged='@(val => _sortDesc = val == "True")'
                          Mandatory
                          Class="hidden-sm-and-down">
                <MButton Large Depressed Color="blue" Value="@("False")">
                    <MIcon>mdi-arrow-up</MIcon>
                </MButton>
                <MButton Large Depressed Color="blue" Value="@("True")">
                    <MIcon>mdi-arrow-down</MIcon>
                </MButton>
            </MButtonGroup>
        </MToolbar>
    </HeaderContent>
    <ChildContent>
        <MRow>
            @foreach (var item in context.Items)
            {
                <MCol Cols="12" Sm="6" @key="item.Name">
                    <MCard>
                        <MCardTitle>
                            <h5>@item.Name</h5>
                        </MCardTitle>
                        <MDivider></MDivider>
                        <MList Dense>
                            <MListItem>
                                <MRow Justify="JustifyTypes.SpaceBetween">
                                    <MCol Cols='"auto"'>
                                        <MListItemContent>Calories:</MListItemContent>
                                    </MCol>
                                    <MCol Cols='"auto"'>
                                        <MListItemContent>@item.Calories</MListItemContent>
                                    </MCol>
                                </MRow>
                            </MListItem>
                            <MListItem>
                                <MRow Justify="JustifyTypes.SpaceBetween">
                                    <MCol Cols='"auto"'>
                                        <MListItemContent>Fat:</MListItemContent>
                                    </MCol>
                                    <MCol Cols='"auto"'>
                                        <MListItemContent>@item.Fat</MListItemContent>
                                    </MCol>
                                </MRow>
                            </MListItem>
                            <MListItem>
                                <MRow Justify="JustifyTypes.SpaceBetween">
                                    <MCol Cols='"auto"'>
                                        <MListItemContent>Carbs:</MListItemContent>
                                    </MCol>
                                    <MCol Cols='"auto"'>
                                        <MListItemContent>@item.Carbs</MListItemContent>
                                    </MCol>
                                </MRow>
                            </MListItem>
                            <MListItem>
                                <MRow Justify="JustifyTypes.SpaceBetween">
                                    <MCol Cols='"auto"'>
                                        <MListItemContent>Protein:</MListItemContent>
                                    </MCol>
                                    <MCol Cols='"auto"'>
                                        <MListItemContent>@item.Protein</MListItemContent>
                                    </MCol>
                                </MRow>
                            </MListItem>
                            <MListItem>
                                <MRow Justify="JustifyTypes.SpaceBetween">
                                    <MCol Cols='"auto"'>
                                        <MListItemContent>Sodium:</MListItemContent>
                                    </MCol>
                                    <MCol Cols='"auto"'>
                                        <MListItemContent>@item.Sodium</MListItemContent>
                                    </MCol>
                                </MRow>
                            </MListItem>
                            <MListItem>
                                <MRow Justify="JustifyTypes.SpaceBetween">
                                    <MCol Cols='"auto"'>
                                        <MListItemContent>Calcium:</MListItemContent>
                                    </MCol>
                                    <MCol Cols='"auto"'>
                                        <MListItemContent>@item.Calcium</MListItemContent>
                                    </MCol>
                                </MRow>
                            </MListItem>
                            <MListItem>
                                <MRow Justify="JustifyTypes.SpaceBetween">
                                    <MCol Cols='"auto"'>
                                        <MListItemContent>Iron:</MListItemContent>
                                    </MCol>
                                    <MCol Cols='"auto"'>
                                        <MListItemContent>@item.Iron</MListItemContent>
                                    </MCol>
                                </MRow>
                            </MListItem>
                        </MList>
                    </MCard>
                </MCol>
            }
        </MRow>
    </ChildContent>
</MDataIterator>

@code {

    [Parameter]
    public bool DisableFiltering { get; set; }

    [Parameter]
    public bool DisablePagination { get; set; }

    [Parameter]
    public bool DisableSort { get; set; }

    [Parameter]
    public bool HideDefaultFooter { get; set; }

    private readonly List<OneOf<int, DataItemsPerPageOption>> _itemsPerPageOptions = new() { 4, 8, 12 };

    private int _itemsPerPage = 4;
    private int _page = 1;
    private string _sortBy = nameof(Item.Calories);
    private bool _sortDesc;
    private string _search;

    private List<ItemValue<Item>> _keys = new()
    {
        nameof(Item.Name),
        nameof(Item.Calories),
        nameof(Item.Fat),
        nameof(Item.Carbs),
        nameof(Item.Protein),
        nameof(Item.Sodium),
        nameof(Item.Calcium),
        nameof(Item.Iron)
    };

    private readonly List<Item> _items = new()
    {
        new Item("Frozen Yogurt", 159, 6.0, 24, 4.0, 87, "14%", "1%"),
        new Item("Ice cream sandwich", 237, 9.0, 37, 4.3, 129, "8%", "1%"),
        new Item("Eclair", 262, 16.0, 23, 6.0, 337, "6%", "7%"),
        new Item("Cupcake", 305, 3.7, 67, 4.3, 413, "3%", "8%"),
        new Item("Gingerbread", 356, 16.0, 49, 3.9, 327, "7%", "16%"),
        new Item("Jelly bean", 375, 0.0, 94, 0.0, 50, "0%", "0%"),
        new Item("Lollipop", 392, 0.2, 98, 0, 38, "0%", "2%"),
        new Item("Honeycomb", 408, 3.2, 87, 6.5, 562, "0%", "45%"),
        new Item("Donut", 452, 25.0, 51, 4.9, 326, "2%", "22%"),
        new Item("KitKat", 518, 26.0, 65, 7, 54, "12%", "6%"),
    };

    private record Item(string Name, double Calories, double Fat, double Carbs, double Protein, double Sodium, string Calcium, string Iron);

}
